<template>
  <div class="person">
    <navBar title="设置" @onClickLeft="onClickLeft" />
    <van-cell-group>
      <van-cell
        title="修改资料"
        value=">"
        @click="$router.push('/user/set/editInfo')"
      />
      <van-cell
        title="修改手机号码"
        value=">"
        @click="$router.push('/user/set/editPhone')"
      />
      <van-cell
        title="修改密码"
        value=">"
        @click="$router.push('/user/set/editPassWord')"
      />
      <van-cell
        title="修改OA账号"
        value=">"
        @click="$router.push('/user/set/setOAAccount')"
      />
      <!-- <van-cell
        title="绑定专利申请系统"
        value=">"
        @click="$router.push('/user/set/setPatentInfo')"
      /> -->
      <van-cell title="联系客服" value=">" @click="showCustomer"> </van-cell>
    </van-cell-group>

    <div class="btn_warp">
      <van-button type="info" class="btn" @click="logOut">退出账号</van-button>
    </div>
  </div>
</template>

<script>
import navBar from "@cb/navBar.vue";
import { Toast, Dialog } from "vant";
export default {
  components: {
    navBar
  },
  data() {
    return {};
  },
  methods: {
    onClickLeft() {
      this.$router.back();
    },
    // 退出按钮
    logOut() {  
      this.$store.commit("delUser");
      this.$store.commit("delToken");
      sessionStorage.removeItem("store");
      sessionStorage.removeItem("token");
      localStorage.removeItem('userinfo');
      this.$router.replace("/");
      Toast.success("退出成功");
    },
    showCustomer() {
      Dialog.confirm({
        title: "提示",
        message: `点击确认将离开本页面跳转到手机拨号`
      })
        .then(() => {
          // on confirm
          window.location.href = "tel://13237126506";
        })
        .catch(() => {
          // on cancel
        });
    }
  }
};
</script>

<style lang="less">
.person {
  .btn_warp {
    margin-top: 10%;
    display: flex;
    justify-content: center;
    .btn {
      width: 325px;
      height: 45px;
      background: #0016ff;
      border-radius: 22.5px;
      position: fixed;
      bottom: 3%;
    }
  }
  .contact {
    color: #323233;
    &:hover {
      color: #323233;
    }
    &:active {
      color: #323233;
    }
    &:visited {
      color: #323233;
    }
  }
}
</style>
